<template>
  <div class="addressList">
    <PageTitle title="地址列表"></PageTitle>
    <van-address-list
      v-if="addressList"
      :switchable="false"
      :list="addressList"
      default-tag-text="默认"
      @select="showAddress = false"
      @add="$router.push('/address/edit')"
      @edit="
        $router.push({
          name: 'AddressEdit',
          params: {
            addressInfo: $event,
          },
        })
      "
    />
  </div>
</template>

<script>
import PageTitle from "@/components/PageTitle";
import { mapMutations } from "vuex";
export default {
  name: "addressList",
  data() {
    return {
      addressList: null,
    };
  },
  components: {
    PageTitle,
  },
  activated() {
    this.getAddressList();
  },
  methods: {
    ...mapMutations(["changeLoading"]),
    getAddressList() {
      this.changeLoading(true);
      this.$axios.get("/api/address/list").then((d) => {
        this.changeLoading(false);
        console.log("address/list", d.data);
        if (d.data.status == 200) {
          let list = [];
          d.data.data.map((item) => {
            let obj = {
              id: item.id,
              name: item.real_name,
              tel: item.phone,
              address: `${item.province} ${item.city} ${item.district} ${item.detail}`,
              isDefault: item.is_default,
            };
            list.push(obj);
          });
          this.addressList = list;
        } else if (d.data.status == 410000) {
          this.$toast.fail("请重新登录");
          this.$store.commit("loginOut");
          this.$router.push("/login");
        } else {
          this.$toast.fail(d.data.msg);
          this.$router.go(-1);
        }
      });
    },
  },
};
</script>

<style lang="less" scoped>
.addressList {
  padding-top: 56px;
  .pageTitle {
    position: fixed;
    z-index: 999;
    top: 0;
    left: 0;
    width: 100%;
  }
  .van-address-list {
    .van-address-item {
      ::v-deep.van-radio__icon--checked .van-icon {
        background-color: #25c9c3;
        border-color: #25c9c3;
      }
      .van-address-item__tag.van-tag--danger {
        background-color: #25c9c3;
      }
    }
    .van-address-list__bottom {
      .van-address-list__add.van-button--danger {
        background-color: #25c9c3;
        border-color: #25c9c3;
      }
    }
  }
}
</style>